<template>
    <div class="advancedCtf">
        <assets-head :title="$t('公证认证')"></assets-head>
        <div class="flex items-center justify-center pt-46 pb-60" v-if="status!=0">
            <img :src="require(`../../assets/image/certificationCenter/advStatus${status}.png`)" alt="" class="w-36 h-36" />
            <span class="ml-16 font-32 textColor">{{fixState(status)}}</span>
        </div>
        <div class="px-32">
            <ExInput :label="$t('真实姓名')"  :disabled="true" :clearBtn="false"  :placeholderText="$t('请输入真实姓名')" v-model="name" />
            <ExInput :label="$t('工作地址')"  :disabled="disabled()" :clearBtn="!disabled()"  :placeholderText="$t('请输入您的工作地址（必填）')" v-model="address" />
            <ExInput :label="$t('家庭地址')"  :disabled="disabled()" :clearBtn="!disabled()" :placeholderText="$t('请输入您的家庭地址（必填）')" v-model="familyAddress" />
        </div>
        <div class="diviLine h-16 mb-48"></div>
        <div class="px-32">
            <ExInput :label="$t('与本人关系')" :disabled="disabled()" :clearBtn="!disabled()" :placeholderText="$t('与本人关系（必填）')" v-model="relationMy" />
            <ExInput :label="$t('亲属姓名')" :disabled="disabled()" :clearBtn="!disabled()" :placeholderText="$t('请输入亲属姓名（必填）')" v-model="relativesName" />
            <ExInput :label="$t('亲属地址')" :disabled="disabled()" :clearBtn="!disabled()"  :placeholderText="$t('请输入亲属地址（必填）')" v-model="relativesAddress" />
            <ExInput :label="$t('亲属电话')" :disabled="disabled()" :clearBtn="!disabled()" :placeholderText="$t('请输入亲属电话（必填）')" v-model="relativesPhone" />
            <div class="btnMain text-black font-34 py-26 rounded-lg text-center mt-60" @click="submit" v-if="status==0 || status==3">
                <span v-if="status==0 ">{{$t('申请认证')}}</span>
                <span v-if="status==3 ">{{$t('重新申请')}}</span>
            </div>
        </div>
    </div>
</template>

<script>
import assetsHead from "@/components/assets-head";
import ExInput from "@/components/ex-input";
import Axios from '@/API/userCenter'
    export default {
        props: {

        },
        components: {
            assetsHead,
            ExInput
        },
        data(){
            return {
                status:'',
                name:'',
                address:'',
                familyAddress:'',
                relationMy:'',
                relativesName:'',
                relativesAddress:'',
                relativesPhone:'',
            }
        },
        created(){
            this.getInfo();
        },
        methods: {
            disabled() { // 是否禁用按钮
                return ![0, 3, ''].includes(this.status)
            },
            getInfo(){
                Axios.getKycHighLevel()
                .then(res=>{
                    this.status = res.data.status
                    this.name = res.data.name
                    this.address = res.data.work_place
                    this.familyAddress = res.data.home_place
                    this.relationMy = res.data.relatives_relation
                    this.relativesName = res.data.relatives_name
                    this.relativesAddress = res.data.relatives_place
                    this.relativesPhone = res.data.relatives_phone
                })
            },
            fixState(status){
                let str = ''
                if (status == 1) {
                    str = this.$t('审核中')
                } else if (status == 2) {
                    str = this.$t('通过认证')
                }else if(status == 3) {
                    str = this.$t('认证失败')
                }
                return str;
            },
            submit(){
                if (this.address == '' || this.address == null) {
                    this.$toast(this.$t('工作地址不能为空'))
                    return false;
                }
                if (this.familyAddress == '' || this.familyAddress == null) {
                    this.$toast(this.$t('家庭地址不能为空'))
                    return false;
                }
                if (this.relationMy == '' || this.relationMy == null) {
                    this.$toast(this.$t('与本人关系不能为空'))
                    return false;
                }
                if (this.relativesName == ''|| this.relativesName == null) {
                    this.$toast(this.$t('亲属姓名不能为空'))
                    return false;
                }
                if (this.relativesAddress == '' || this.relativesAddress == null) {
                    this.$toast(this.$t('亲属地址不能为空'))
                    return false;
                }
                if (this.relativesPhone == ''|| this.relativesPhone == null ) {
                    this.$toast(this.$t('亲属电话不能为空'))
                    return false;
                }
                Axios.kycHighLevelApply({
                    work_place: this.address,
                    home_place: this.familyAddress,
                    relatives_relation: this.relationMy,
                    relatives_name: this.relativesName,
                    relatives_place: this.relativesAddress,
                    relatives_phone: this.relativesPhone,
                }).then(res=>{
                    this.$router.push('/verified')
                    this.$toast(this.$t('申请成功'));
                }).catch(err=>{
                    if(err.code === 'ECONNABORTED'){this.$toast(this.$t('网络超时！'));}
                    else if(err.msg !== undefined){this.$toast(this.$t(err.msg));}         
                })
            }
        }
    }
</script>

<style lang="scss" scoped>
.advancedCtf{
    width: 100%;
    box-sizing: border-box;
}
</style>